<?php /*a:1:{s:53:"D:\sll\WWW\ls_shop\app\admin\view\auth\menu_list.html";i:1630198358;}*/ ?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>权限列表</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <!-- <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> -->
        
        <link rel="stylesheet" href="/static/layui/css/layui.css"  media="all">

        <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
        <link rel="stylesheet" href="/static/css/font.css">
        <link rel="stylesheet" href="/static/css/xadmin.css">
        
        <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
        <script type="text/javascript" src="/static/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="/static/js/xadmin.js"></script>
    </head>
<body>
    <div style="padding: 20px">
        <div class="demoTable">
            <div class="layui-inline">
                <input class="layui-input" name="name" id="name" autocomplete="off" placeholder="搜索名称">
            </div>
            <button class="layui-btn" id="seach">搜索</button>
        </div>
    
        <table class="layui-hide" id="test" lay-filter="test"></table>
    </div>

    <script type="text/html" id="toolbar">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm layui-btn-normal" type="type" onclick="add()">添加权限</button>
        </div>
    </script>
 
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>

    <script>
        var page = 1;
        $(function(){
            if(window.location.href.includes('#!true=')){
                page = window.location.href.split('#!true=')[1];
            }
        })
        
        layui.use('table', function(){
            var table = layui.table, form = layui.form;

            function getList(){
                table.render({
                    elem: '#test'
                    ,url:'<?php echo url("Auth/menu_data"); ?>'
                    ,toolbar: '#toolbar' // 开启头部工具栏
                    ,defaultToolbar: ['filter']
                    ,where: {
                        key: {
                            name: $('#name').val()
                        }
                    }
                    ,cols: [[
                        {field:'sort', title:'排序值', fixed: 'left', width: 100, unresize: true, sort: true, edit: 'text'}
                        ,{field:'id', title:'ID', fixed: 'left', width: 80, unresize: true, sort: true}
                        ,{field:'icon', title:'图标', width: 80}
                        ,{field:'name', title:'名称'}
                        ,{field:'module', title:'模块'}
                        ,{field:'controller', title:'控制器'}
                        ,{field:'action', title:'方法'}
                        ,{field:'is_show', title:'状态', width: 120, templet: function(res){
                            return `<input type="checkbox" ${res.is_show == 1?'checked':''} name="is_show" lay-skin="switch" lay-text="显示|隐藏" lay-filter="is_show">`
                        }, unresize: true}
                        ,{fixed: 'right', title:'操作', width: 120, toolbar: '#barDemo'}
                    ]]
                    ,page: {
                        curr: page,
                        hash: true
                    }
                });
            }

            getList()

            $("#seach").on('click',function(){
                getList()
            })

            // 监听单元格编辑
            table.on('edit(test)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
                // console.log(obj.value); //得到修改后的值
                // console.log(obj.field); //当前编辑的字段名
                // console.log(obj.data); //所在行的所有相关数据

                $.post('<?php echo url("Auth/setMenuOnlyEdit"); ?>',{
                    id: obj.data.id
                    ,field: obj.field
                    ,value: obj.value
                },function(res){
                    if(res.code == 400){
                        layer.msg(res.msg, {icon: 2, time: 1000});
                    }else{
                        layer.msg(res.msg, {icon: 1, time: 1000});
                    }

                    setTimeout(() => {
                        getList()
                    }, 1000);
                })
            });

            // 显示||隐藏操作
            form.on('switch(is_show)', function(obj){
                let id = $(obj.elem).parents("tr").find("td[data-field='id'] div").text()
                $.post('<?php echo url("Auth/setIsShow"); ?>',{id:id},function(res){
                    if(res.code == 400){
                        layer.msg(res.msg, {icon: 2, time: 1000}, function(){
                            getList();
                        });
                    }else{
                        layer.msg(res.msg, {icon: 1, time: 1000}, function(){
                            getList();
                        });
                    }
                })
            });
          
            // 监听行工具事件
            table.on('tool(test)', function(obj){
                var data = obj.data;

                if(obj.event === 'del'){
                    layer.confirm('真的删除么', function(index){
                        $.post('<?php echo url("Auth/menu_del"); ?>',{
                            id: obj.data.id
                        },function(res){
                            if(res.code == 400){
                                layer.msg(res.msg, {icon: 2});
                            }else{
                                obj.del();
                                layer.msg(res.msg, {icon: 1, time: 1000}, function(){
                                    getList();
                                }, 1000);
                            }
                        })

                        layer.close(index);
                    });
                }else if(obj.event === 'edit'){
                    window.location.href = "<?php echo url('Auth/menu_edit'); ?>?id=" + obj.data.id;
                }
            });
        });

        // 跳转添加页
        function add(){
            window.location.href = "<?php echo url('Auth/menu_add'); ?>";
        }
    </script>
</body>
</html>